
<div data-ng-show="url && url!=''">
    <div data-ng-show="layerName!=''"
         data-translate=""
         data-translate-values="{url:'{{url}}', layer:'{{layerSelected.Title}} ({{layerName}})'}">
              wmsLinkDetails
    </div>

    <div data-ng-show="layerName==''"
         data-translate=""
         data-translate-values="{url:'{{url}}'}">
              wmsServiceLinkDetails
    </div> <br/>
</div>

<div data-ng-show="capabilitiesChecked">
    <div data-ng-show="!isWmsAvailable || !(capabilities && capabilities.layers.length>0)" 
         class="alert alert-warning ngr-margin-top" data-translate="">wmsCapabilitiesNotAvailable</div>


<div data-ng-show="isWmsAvailable && capabilities && capabilities.layers.length>0 && isMapViewerEnabled">
    <div data-ng-show="!isLayerInCapabilities && layerName!=''"
         data-translate=""
         class="alert alert-warning ngr-margin-top"
         data-translate-values="{layerName:'{{layerName}}'}">wmsLayerNotAvailable</div>

    <div data-ng-show="layerName==''"
         data-translate=""
         class="alert alert-info ngr-margin-top">selectLayerFromService</div>
     
  <div class="row" data-ng-show="isMapViewerEnabled">
    <div class="col-md-8 ngr-nopadding-left">
      <select class="form-control"
              data-ng-model="layerSelected"
              data-ng-options="layer as (layer.Title + ' (' + layer.Name + ')') for layer in capabilities.layers |filter: hasName | orderBy: 'Title'">

        <option value="">{{'wmsChooseLayerToAdd' | translate}}</option>
      </select>
    </div>
  
  <div data-ng-show="layerSelected && isMapViewerEnabled">       
    <div class="col-md-8 ngr-nopadding-left" data-ng-show="layerSelected.Style&&layerSelected.Style.length>1">
    <select class="form-control"
              data-ng-model="layerStyle"
              data-ng-options="style as (style.Title||style.Name) for style in layerSelected.Style">
        <option value="">{{'wmsChooseStyle' | translate}}</option>
    </select>
    </div>

    <div class="col-md-4 ngr-nopadding-left">
    <div class="btn-group">
          <button type="button"
                class="btn btn-ngr-outline"
                data-ng-click="addSelectedLayerToMap(layerSelected,layerStyle.Name)">
            <span data-translate="">addToMap</span>
          </button>
        </div>
    </div>
    </div>
    </div>
  </div>
</div>

<div data-ng-show="!capabilitiesChecked">
  <i class="fa fa-spinner fa-spin fa-3x fa-fw"></i>
  <span class="sr-only">Loading...</span>
</div>

